<div class="modal-dialog modal-lg">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <h4 class="modal-title">查询历史变更数据</h4>
    </div>

    <div class="modal-body">

      <form class="form-inline">
        <div class="box-body">
          <div class="form-group col-lg-12" style="padding-left:0px !important;margin-bottom:8px;">
            <label>从：</label>
            <div class="input-group date form_datetime">
              <span class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </span>
              <input class="form-control" type="text" [(ngModel)]="getBody.sCreateStart" name="sCreateStart" style="background: white; cursor: pointer;"
                mwlFlatpickr>
            </div>
            <label>到：</label>
            <div class="input-group date form_datetime">
              <span class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </span>
              <input class="form-control" type="text" [(ngModel)]="getBody.sCreateEnd" name="sCreateEnd" style="background: white; cursor: pointer;"
                mwlFlatpickr>
            </div>
            <button type="button" class="btn btn-primary" style="margin-left:10px;" (click)="searchQuery()">
              <i class="fa fa-search"></i>查询</button>
            <button type="button" class="btn btn-primary" (click)="exportExcel()">
              <i class="fa fa-sign-out"></i>导出</button>
          </div>
          <div class="form-group col-lg-12" style="padding-left:0px !important;">
            <label class="control-label">文件名称：</label>
            <input type="text" class="form-control" placeholder="文件名称" maxlength="100" [(ngModel)]="getBody.sFileName" name="sFileName">
            <label class="control-label">内容：</label>
            <input type="text" class="form-control" placeholder="内容" maxlength="2000" [(ngModel)]="getBody.f1" name="f1">
            <label class="control-label">适用基金组：</label>
            <!-- <input class="form-control" placeholder="适用基金组" [(ngModel)]="getBody.sFundGroupdsZh" name="sFundGroupdsZh">
            <i class="fa fa-search" (click)="showApplyFundGroup()"></i> -->
            <div class="input-group" (click)="showApplyFundGroup()">
              <input class="form-control" placeholder="适用基金组" disabled [(ngModel)]="sFundGroupdsZh" name="sFundGroupdsZh">
              <div class="input-group-addon" (click)="showApplyFundGroup()">
                <i class="fa fa-search"></i>
              </div>
            </div>
          </div>
        </div>

      </form>
      <div class="ibt-fixed-table-container">
          <div class="table-scroll-content" style="overflow-y:scroll;height:350px;">
              <div #historyTablePage>
            <!-- <table id="route-table" class="table table-bordered table-hover table-striped table-keep-line">
              <thead>
                <tr role="row">
                  <th>
                    <div class="cell">序号</div>
                  </th>
                  <th>
                    <div class="cell">编号</div>
                  </th>
                  <th>
                    <div class="cell">批次号</div>
                  </th>
                  <th>
                    <div class="cell">是否有效</div>
                  </th>
                  <th>
                    <div class="cell">属性</div>
                  </th>
                  <th>
                    <div class="cell">条款出处</div>
                  </th>
                  <th>
                    <div class="cell">文件名称</div>
                  </th>
                  <th>
                    <div class="cell">适用基金类别</div>
                  </th>
                  <th>
                    <div class="cell">适用基金组</div>
                  </th>
                  <th>
                    <div class="cell">内容</div>
                  </th>
                  <th>
                    <div class="cell">指标释义</div>
                  </th>
                  <th>
                    <div class="cell">条目规定阀值</div>
                  </th>
                  <th>
                    <div class="cell">事中控制方法</div>
                  </th>
                  <th>
                    <div class="cell">事中系统控制阀值</div>
                  </th>
                  <th>
                    <div class="cell">是否事中系统可控</div>
                  </th>
                  <th>
                    <div class="cell">系统风控编号</div>
                  </th>
                  <th>
                    <div class="cell">事中系统备注</div>
                  </th>
                  <th>
                    <div class="cell">事后监控方法</div>
                  </th>
                  <th>
                    <div class="cell">监控编号</div>
                  </th>
                  <th>
                    <div class="cell">控制说明</div>
                  </th>
                  <th>
                    <div class="cell">补偿控制</div>
                  </th>
                  <th>
                    <div class="cell">风险等级</div>
                  </th>
                  <th>
                    <div class="cell">监察部备注1</div>
                  </th>
                  <th>
                    <div class="cell">监察部备注2</div>
                  </th>
                  <th>
                    <div class="cell">场外系统阀值(新股,定增,转债)</div>
                  </th>
                  <th>
                    <div class="cell">场外系统阀值(公增)</div>
                  </th>
                  <th>
                    <div class="cell">是否场外系统可控</div>
                  </th>
                  <th>
                    <div class="cell">场外风控编号</div>
                  </th>
                  <th>
                    <div class="cell">场外系统备注</div>
                  </th>
                  <th>
                    <div class="cell">录入人</div>
                  </th>
                  <th>
                    <div class="cell">录入时间</div>
                  </th>
                  <th>
                    <div class="cell">复核人</div>
                  </th>
                  <th>
                    <div class="cell">复核时间</div>
                  </th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let item of listData;let index = index;">
                  <td [attr.title]="index+1">
                    <div class="short_name">{{index+1}}</div>
                  </td>
                  <td [attr.title]="item.nNjId">
                    <div class="short_name">{{item.nNjId}}</div>
                  </td>
                  <td [attr.title]="item.nBatchNo">
                    <div class="short_name">{{item.nBatchNo}}</div>
                  </td>
                  <td [attr.title]="item.sValidZh">
                    <div class="short_name" id="sValid">{{item.sValidZh}}</div>
                  </td>
                  <td [attr.title]="item.sItemTypeZh">
                    <div class="short_name" id="sItemTypeZh">{{item.sItemTypeZh}}</div>
                  </td>
                  <td [attr.title]="item.sFileSourceZh">
                    <div class="short_name" id="sFileSourceZh">{{item.sFileSourceZh}}</div>
                  </td>
                  <td [attr.title]="item.sFileName">
                    <div class="short_name" id="sFileName">{{item.sFileName}}</div>
                  </td>
                  <td [attr.title]="item.sFundTypeZh">
                    <div class="short_name" id="sFundTypeZh">{{item.sFundTypeZh}}</div>
                  </td>
                  <td [attr.title]="item.sFundGroupdsZh">
                    <div class="short_name" id="sFundGroupdsZh">{{item.sFundGroupdsZh}}</div>
                  </td>
                  <td [attr.title]="item.f1">
                    <div class="short_name" id="f1">{{item.f1}}</div>
                  </td>
                  <td [attr.title]="item.f2">
                    <div class="short_name" id="f2">{{item.f2}}</div>
                  </td>
                  <td [attr.title]="item.f3">
                    <div class="short_name" id="f3">{{item.f3}}</div>
                  </td>
                  <td [attr.title]="item.f4Zh">
                    <div class="short_name" id="f4Zh">{{item.f4Zh}}</div>
                  </td>
                  <td [attr.title]="item.f5">
                    <div class="short_name" id="f5">{{item.f5}}</div>
                  </td>
                  <td [attr.title]="item.f6Zh">
                    <div class="short_name" id="f6Zh">{{item.f6Zh}}</div>
                  </td>
                  <td [attr.title]="item.f7">
                    <div class="short_name" id="f7">{{item.f7}}</div>
                  </td>
                  <td [attr.title]="item.f8">
                    <div class="short_name" id="f8">{{item.f8}}</div>
                  </td>
                  <td [attr.title]="item.f9Zh">
                    <div class="short_name" id="f9Zh">{{item.f9Zh}}</div>
                  </td>
                  <td [attr.title]="item.f10">
                    <div class="short_name" id="f10">{{item.f10}}</div>
                  </td>
                  <td [attr.title]="item.f11">
                    <div class="short_name" id="f11">{{item.f11}}</div>
                  </td>
                  <td [attr.title]="item.f12">
                    <div class="short_name" id="f12">{{item.f12}}</div>
                  </td>
                  <td [attr.title]="item.f13Zh">
                    <div class="short_name" id="f13Zh">{{item.f13Zh}}</div>
                  </td>
                  <td [attr.title]="item.f14">
                    <div class="short_name" id="f14">{{item.f14}}</div>
                  </td>
                  <td [attr.title]="item.f15">
                    <div class="short_name" id="f15">{{item.f15}}</div>
                  </td>
                  <td [attr.title]="item.f16">
                    <div class="short_name" id="f16">{{item.f16}}</div>
                  </td>
                  <td [attr.title]="item.f17">
                    <div class="short_name" id="f17">{{item.f17}}</div>
                  </td>
                  <td [attr.title]="item.f18Zh">
                    <div class="short_name" id="f18Zh">{{item.f18Zh}}</div>
                  </td>
                  <td [attr.title]="item.f19">
                    <div class="short_name" id="f19">{{item.f19}}</div>
                  </td>
                  <td [attr.title]="item.f20">
                    <div class="short_name" id="f20">{{item.f20}}</div>
                  </td>
                  <td [attr.title]="item.sCreator">
                    <div class="short_name">{{item.sCreator}}</div>
                  </td>
                  <td [attr.title]="item.sLaunchDate">
                    <div class="short_name">{{item.sLaunchDate}}</div>
                  </td>
                  <td [attr.title]="item.sCheckPerson">
                    <div class="short_name">{{item.sCheckPerson}}</div>
                  </td>
                  <td [attr.title]="item.sCheck">
                    <div class="short_name">{{item.sCheck}}</div>
                  </td>
                </tr>
              </tbody>
            </table> -->
          </div>
        </div>
      </div>
      <div class="box-footer clearfix" style="width:100%;">
        <app-pagination [currentPageNum]="listPageInfo.currentPageNum" [pagesShow]="" [totalPages]="listPageInfo.totalPages" (pageChanged)="pageNavigation($event)">
          <div class="pull-left pagination-detail" data-pagination-additional="true">
            <span class="pagination-info">
              当前显示第{{listPageInfo.startRow}}到第{{listPageInfo.endRow}}条，总共{{listPageInfo.total}}条，
            </span>
            <span class="page-list">
              每页记录
              <span class="btn-group dropup">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                  <span class="page-size">{{listPageInfo.pageSize}}</span>
                  <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" role="menu">
                  <li *ngFor="let i of listPageInfo.pageList" role="menuitem" [class.active]="listPageInfo.pageSize === i" (click)="sizeChange(i)">
                    <a>{{i}}</a>
                  </li>
                </ul>
              </span>
              条
            </span>
          </div>
        </app-pagination>
      </div>
    </div>

    <div class="modal-footer">
      <button type="button" class="btn btn-default pull-left" data-dismiss="modal">退出</button>
      <!-- <button type="button" class="btn btn-primary" (click)="saveEntry()">
          <i class="fa fa-save"></i>保存</button> -->
    </div>
  </div>
</div>

<!-- 适用基金组modal -->
<div class="modal modal-detail" id="applyFundGroup">
  <div #applyFundGroup></div>
</div>